import 'package:flutter/material.dart';
import 'package:flutterapp/Base/style/MyStyles.dart';

class DemoPageTab extends StatefulWidget {
  static const ROUTER_NAME = "DemoPageTab";

  @override
  _DemoPageTabState createState() => _DemoPageTabState();
}

class _DemoPageTabState extends State<DemoPageTab>
    with SingleTickerProviderStateMixin {
  final _tabNames = ["tab1", "tab2", "tab3"];
  TabController _tabController;
  PageController _pageViewController;

  @override
  void initState() {
    super.initState();
    _tabController = new TabController(
        length: _tabNames.length, vsync: this, initialIndex: 0);
    _pageViewController = new PageController(initialPage: 0);
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("tabView"),
        bottom: TabBar(
            onTap: (index) {
              _pageViewController.animateToPage(index,
                  duration: Duration(milliseconds: 200),
                  curve: Curves.easeInOut);
            },
            controller: _tabController,
            indicatorPadding: EdgeInsets.symmetric(horizontal: 10),
            // labelColor: MyColors.SECOND_COLOR,
            tabs: _tabNames
                .map((e) => Tab(
                      text: e,
                    ))
                .toList()),
      ),
      body: PageView(
        controller: _pageViewController,
        physics: NeverScrollableScrollPhysics(),
        children: [
          TabPage1(),
          TabPage2(),
          TabPage3(),
        ],
        onPageChanged: (index) {},
      ),
    );
  }
}

class TabPage1 extends StatefulWidget {
  @override
  _TabPage1State createState() => _TabPage1State();
}

class _TabPage1State extends State<TabPage1> {
  @override
  Widget build(BuildContext context) {
    return Container(
      child: Center(
        child: Text("tabPage1: $this"),
      ),
    );
  }

  @override
  void initState() {
    super.initState();
    print("tabPage1 initState $this");
  }

  @override
  void dispose() {
    print("tabPage1 dispose $this");
    super.dispose();
  }
}

class TabPage2 extends StatefulWidget {
  @override
  _TabPage2State createState() => _TabPage2State();
}

class _TabPage2State extends State<TabPage2>with AutomaticKeepAliveClientMixin {
  @override
  Widget build(BuildContext context) {
    return Container(
      child: Center(
        child: Text("TabPage2(keepAlive): $this"),
      ),
    );
  }

  @override
  void initState() {
    super.initState();
    print("TabPage2 initState $this");
  }

  @override
  void dispose() {
    print("TabPage2 dispose $this");
    super.dispose();
  }

  @override
  // TODO: implement wantKeepAlive
  bool get wantKeepAlive => true;
}

class TabPage3 extends StatefulWidget {
  @override
  _TabPage3State createState() => _TabPage3State();
}

class _TabPage3State extends State<TabPage3> {
  @override
  Widget build(BuildContext context) {
    return Container(
      child: Center(
        child: Text("TabPage3: $this"),
      ),
    );
  }

  @override
  void initState() {
    super.initState();
    print("TabPage3 initState $this");
  }

  @override
  void dispose() {
    print("TabPage3 dispose $this");
    super.dispose();
  }
}
